<template>
    <div class="container">
        <div style="width: 100%;display: flex;justify-content: space-between;align-items: center;">
            <div>
            <el-input style="border-radius: 0 5px 5px 0; width:300px;" placeholder="请输入关键词" v-model="searchName1">
                    <i slot="prefix" class="el-input__icon el-icon-search"></i>
                    <el-button slot="append" @click="handleSearch1">搜索</el-button>
            </el-input>
           </div>
           <div style="display: flex;flex: 1;justify-content: right;align-items: center;">
            <el-button type="primary" @click='gogongyi' v-if="!added">添加工艺</el-button>
            <el-upload
                class="upload-demo"
                style="margin-top: 5px;margin-left: 10px;"
                ref="upload"
                :action="action"
                :on-change="uploadonchange"
                accept=".xlsx,.xls"
                :show-file-list='false'
                :auto-upload="false">
                <el-button slot="trigger" size="small">导入模板</el-button>
            </el-upload>
            <el-button style="float:right; margin-right: 10px" @click="download">模板下载</el-button>  
           </div>
        </div> 
        <el-table
            :data="tableData"
            ref="multipleTable"
            header-cell-class-name="table-header"
            style="margin-top:20px;"
            v-if="!scflag"
        >
            <el-table-column prop="name" sortable label="工艺名称"></el-table-column>
            <el-table-column prop="productName" sortable label="品名"></el-table-column>
            <el-table-column label="操作" width="150" align="center">
                <template slot-scope="scope">
                    <el-button
                        type="text"
                        v-if="!edit"
                        @click="handleEdit(scope.$index, scope.row)"
                    >编辑</el-button>
                    <el-button
                        type="text"
                        v-if="!del"
						style="color: red;"
                        @click="handleDelete(scope.$index, scope.row)"
                    >删除</el-button>
                </template>
            </el-table-column>
        </el-table>

        <!--   生产系统   -->
        <el-table
            :data="tableData"
            ref="multipleTable"
            header-cell-class-name="table-header"
            style="margin-top:20px;"
            v-if="scflag"
        >
            <el-table-column prop="processName" sortable label="工艺名称">
                <template slot-scope="scope">
					<div>
						{{scope.row.processName}}
					</div>
				</template>
            </el-table-column>
            <el-table-column prop="materialName" sortable label="物料名称"></el-table-column>
			<el-table-column prop="materialCode" sortable label="物料名称">
				<template slot-scope="scope">
					<div>
						{{scope.row.materialCode}}
					</div>
				</template>
			</el-table-column>
            <!-- <el-table-column prop="materialCode" sortable label="物料类型"></el-table-column> -->

            <el-table-column label="操作" width="150" align="center">
                <template slot-scope="scope">
                    <el-button
                        type="text"
                        v-if="!edit"
                        @click="handleEdit(scope.$index, scope.row)"
                    >编辑</el-button>
                    <el-button
                        type="text"
                        v-if="!del"
						style="color: red;"
                        @click="handleDelete(scope.$index, scope.row)"
                    >删除</el-button>
                </template>
            </el-table-column>
        </el-table>
        <el-pagination layout="total, prev, pager, next, jumper" :page-size="pagesize" :current-page.sync="currentPage"  @current-change="handleCurrentChange" :total="total" style="margin-top:20px"></el-pagination>
        <big-img v-if="showImg" @clickit="viewImg" :imgSrc="imgSrc"></big-img>
    </div>
</template>
<script>
    import BigImg from '../../../common/BigImg.vue';
    import {technology_findByList,technology_delete,process_daoru} from '@/request/api'
    import {scTechnology_inquire,scTechnology_delete,scTechnology_search} from '@/request/produceApi'  //生产工艺工序接口
    export default {
        components: { 'big-img':BigImg},
        data() { 
            return {
                imgSrc:'',
                showImg:false,
                total:0,
                currentPage:1,
                pagesize:10,
                searchName1: '',
                activeName: '中药饮片',
                tableData: [],
                boxCode:'',
                action:'',
                added:false,
                edit:true,
                del:true,
                scflag: false
            };
        },
         created(){

        },
        mounted(){
            this.init();
            // this.init1()
            this.judgmentAuthority();
        },
        methods: {
            gogongyi(){
                this.$router.push({
                    path:'processlist/added',
                })
            },
            download(){
                const companyId =  localStorage.getItem('companyId')
				window.location.href = "http://124.89.83.132:81/api" + "/plant/template/toCraft?appId=002&companyId=" + companyId;
            },
            handlecheck(index,row){
                this.showImg = true;
　　　　　　    // 获取当前图片地址
　　　　　　    this.imgSrc = this.$store.state.plantImg + row.standards;
            },
            viewImg(){
                this.showImg = false;
            },
            init(){
                var lj = localStorage.getItem('lj');
                if( lj == "生产") {
                    this.scflag = true
                    let data = {
                        page:this.currentPage,
                    }
                    scTechnology_inquire(data).then((res)=>{
                        this.total = res.total
                        this.tableData = res.rows
                    })
                } else {
                    let data = {
                        page:this.currentPage,
					    query:this.searchName1
                    }
                    technology_findByList(data).then((res)=>{
                        this.total = res.total
                        this.tableData = res.rows

                    })
                }
            },

            handleCurrentChange(val){
                this.currentPage = val
                this.init()
            },

            handleClick(){
                console.log(this.activeName)
            },
            // 调用接口
            getcase(){

            },
            handleEdit(index,row){
                this.$router.push({
                    path:'/processlist/edit',
                    query:{
                        id:row.id
                    }
                })
            },
            //删除
            handleDelete(index,row){
                this.$confirm('此操作将永久删除该条数据, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    var lj = localStorage.getItem('lj');
                    if( lj == "生产") {
                        scTechnology_delete(row.id).then((res)=>{
                            this.$notify({
                                title: '操作成功',
                                message: '删除成功',
                                type: 'success'
                            });
                            this.init()
                        })
                    } else {
                        technology_delete(row.id).then((res)=>{
                            // this.tableData.splice(row,1)
                            this.$notify({
                                title: '操作成功',
                                message: '删除成功',
                                type: 'success'
                            });
                            this.init()
                        })
                    }
                });
            },
            uploadonchange(file) {
                let formData = new FormData();
                formData.append('file', file.raw);
                let config = {
                    headers:{'Content-Type':'multipart/form-data'}
                };
                process_daoru(formData).then((res) =>{
                    if (res.code == 200) {
                        this.$notify({
                            title: '操作成功',
                            message: '导入成功',
                            type: 'success'
                        });
                        this.init()
                    } else{
                        this.$notify.error({
                            title: '操作失败',
                            message: '导入失败',
                            type: 'error'
                        });
                    }
                })
            },
            handleSearch1() {
                var lj = localStorage.getItem('lj');
                if( lj == "生产") {
                    let searchmaterialName = {
                        processName: this.searchName1
                    }
                    scTechnology_search(searchmaterialName).then((res) =>{
                        // console.log(res,'121212');
                        this.tableData = res.data
                        this.total = (res.data).length
                        // console.log(this.total,'1313');
                        // console.log(this.tableData,'1414');
                    })
                } else {
                    this.currentPage = 1
                    this.init()
                }
            },

            //判定操作按钮显示
            judgmentAuthority() {
                var type = JSON.parse(localStorage.getItem('panduanzhuangtai'));
                type.map((item1) => {
                    if (item1.name == '工艺工序' && item1.children != null) {
                        for (var i = 0; i < item1.children.length; i++) {
                            if (item1.children[i].name == '新增') this.added = false;
                            if (item1.children[i].name == '编辑') this.edit = false;
                            if (item1.children[i].name == '删除') this.del = false;
                        }
                    }
                });
            }

        }
    }
</script>

<style lang="less" scoped>
/deep/.el-upload--text{
    width: 80px;
    height: 34px;
    margin-right: 10px
}
.scopClass .el-table{ margin-top: 20px;}
.scopClass .el-pagination{
    text-align: center;
}
/* .el-row{ margin-bottom: 20px;} */
.el-pagination{
    text-align: center;
}
.el-col{
    margin-bottom:0;
}
</style>
